// 底部组件
import React, { Component } from 'react';
import bottom from "../css/Mytabbar.module.css";
import { withRouter } from "react-router-dom"
import { AppstoreOutlined, HomeOutlined, ShoppingOutlined, ShoppingCartOutlined, UserOutlined  } from '@ant-design/icons';

class MyTabbar extends Component {
    fun = () => {
        this.props.history.push("/index")
    }
    fun2 = () => {
        console.log(1);
        this.props.history.push("/list")
    }
    fun3 = () => {
        this.props.history.push("/all")
    }
    fun4 = () => {
        this.props.history.push("/shop")
    }
    fun5 = () => {
        this.props.history.push("/my")
    }
    render() {
        return (
            <div onClick={this.fun} className={bottom.bar}>
                <div className={bottom.ha}>
                    <HomeOutlined style={{fontSize:"24px"}} />
                    <span className={bottom.ss}>首页</span>
                </div>
                <div className={bottom.ha} onClick={this.fun2}>
                    <AppstoreOutlined style={{ fontSize: "24px" }} />
                    <span className={bottom.ss}>分类</span>
                </div>
                <div className={bottom.ha} onClick={this.fun3}>
                    <ShoppingOutlined style={{ fontSize: "24px" }} />
                    <span className={bottom.ss}>全部商品</span>
                </div>
                <div className={bottom.ha} onClick={this.fun4}>
                    <ShoppingCartOutlined style={{ fontSize: "24px" }} />
                    <span className={bottom.ss}>购物车</span>
                </div>
                <div className={bottom.ha} onClick={this.fun5}>
                    <UserOutlined style={{ fontSize: "24px" }} />
                    <span className={bottom.ss}>个人中心</span>
                </div>
            </div>
        );
    }
}

export default withRouter(MyTabbar)
